<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/semantic-ui@2.4.2/dist/semantic.min.css">
    <link href="https://cdn.staticfile.org/twitter-bootstrap/5.1.1/css/bootstrap.min.css" rel="stylesheet">
    <script src="https://cdn.staticfile.org/twitter-bootstrap/5.1.1/js/bootstrap.bundle.min.js"></script>

    <title>书籍首页</title>
    <style type="text/css">
        table {border-collapse: collapse; font-size: 14px;
            width: 80%; margin: auto}
        table, th, td {border: 0px solid darkslategray;padding: 10px}
        body{
            background: url("https://tse1-mm.cn.bing.net/th/id/R-C.b823fbabd1be09304cc370dca2754a3e?rik=G%2fm1vdCGVV21mA&riu=http%3a%2f%2fimg95.699pic.com%2fphoto%2f50062%2f1794.jpg_wh860.jpg&ehk=FEUbqMY8kF6GhBx2sTBZQH9RbTaVnKYH4YEzR6xSSuw%3d&risl=&pid=ImgRaw&r=0") no-repeat;
                    background-size: 100%
        }
        .btgn{
            font-family: 仿宋;
            font-size: 16px;
            color: black;
            background-color: #99CCFF;
            text-align: center;
        }

        tr:nth-child(2n){
            background-color:white;
        }
        tr:nth-child(2n+1) {
            background-color: gainsboro;
        }
        p{
            color: black;
        font-size: 25px;
        }


    </style>
</head>
<body>
搜索:<input type="text" name="name" placeholder="请您输入你要查询的内容" />
<input type="submit" value="搜素" />
<div style="text-align: center">

    <span class="span" style="color: green; font-size: 25px">书籍首页</span>
    <br/>
    <table class="list">
        <tr>
            <th class="btgn">id</th>
            <th class="btgn">书名</th>
            <th class="btgn"> 价格</th>
            <th class="btgn"> 数量</th>
<!--            <th class="btgn"> 操作</th>-->


        </tr>
        <tr th:each="books : ${pageInfo.list}">


            <!--/*@thymesVar id="id" type=""*/-->
            <td th:text="${books.id}"></td>
            <td th:text="${books.book}"></td>
            <td th:text="${books.price}"></td>
            <td th:text="${books.nums}"></td>
<!--            <td><a th:href="@{'/delete/'+${books.id}}"><button class="btn btn-danger">下架书籍</button></a>-->
<!--                <a th:href="@{'/updatePage/'+${books.id}}"><button class="btn btn-primary">更新书籍</button></a>-->
            </td>

        </tr>
    </table>
    <a href="/home">   <button  class="btn btn-success">返回首页</button></a>
    <p>当前 <span th:text="${pageInfo.pageNum}"></span> 页,
        总 <span th:text="${pageInfo.pages}"></span> 页,
        共<span th:text="${pageInfo.total}"></span> 条记录
    </p>
    <br>
    <a th:href="@{/getAllBook}">首页</a>
    <a th:href="@{/getAllBook(pageNum=${pageInfo.hasPreviousPage}?${pageInfo.prePage}:1)}">上一页</a>
    <a th:href="@{/getAllBook(pageNum=${pageInfo.hasNextPage}?${pageInfo.nextPage}:${pageInfo.pages})}">下一页</a>
    <a th:href="@{/getAllBook(pageNum=${pageInfo.pages})}">尾页</a>
</div>


</div>

</body>
</html>
